<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>首页</title>
<style>
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td {margin:0;padding:0;}
button, input, select, textarea {font-size:14px;vertical-align:middle;border:none;}
body {font-size:14px;color:#212121;width:100%;margin:0 auto;background:#055397;}
a {color:#212121;text-decoration:none;}
a:hover {color:#ff6600;text-decoration:none;}
ul {list-style-type:none}
img {border:none;}
* {margin:0;padding:0;}
.clear {clear:both;}

.top_logo {margin:0 auto;width:550px;text-align:center;margin-top:75px;}
.login_aside {width:240px;margin:50px auto 0; overflow:hidden}
.fm_item {height:32px; width:238px; border:1px solid #4584c7; background:#FFFFFF; margin-bottom:18px; }
.fm_item_1 {height:34px; width:240px; margin-bottom:18px; }
.fm_item_yzm {height:32px; width:238px; border:1px solid #4584c7; background:#FFFFFF; float:left}
.form_label {display: block;float:left;margin-top:2px;width:30px;padding-left:8px;}
.i_text {width:200px; height:32px; margin-top:0px; border:0;background:none;color:#959595;font-size:14px;text-indent:12px;font-family:"微软雅黑"}
.yzm {width:100px;height:32px; margin-top:0px; float:left; border:0;background:none;color:#a6a5a5;font-size:14px;text-indent:12px;font-family:"微软雅黑";}
.yzm_img {cursor:pointer; float:right; width:90px; text-align:right; /*padding-top:3px;*/ margin-top:-35px; margin-right: 5px;}
.btn_bg {width:151px;height:31px;background:url(./theme/images/login/btn-bg.png) no-repeat; background-size:100% 100%;
-moz-background-size:35% 100%; border:none; cursor:pointer; float: right; color:#fff; font-weight: bold;}
/* .btn_login {width:86px;height:31px;background:url(./theme/images/login/login-btn.png) no-repeat;border:none; cursor:pointer; text-align:center; margin:20px 0 0 72px} */
.login_bottom {line-height:40px;height:40px;text-align:center;font-size:12px;border:0;position:absolute;left:37%;bottom:20px; color:#e3e3e3; margin-left:-50px;}

div{overflow:hidden; *display:inline-block;}div{*display:block;}
.login_box{background:url(./theme/images/login/bg_2018-05-24.jpg) no-repeat; width:1300px; height:840px; overflow:hidden; position:absolute; left:50%; top:50%; margin-left:-650px; margin-top:-420px;}

</style>

<script src="./theme/js/jquery-1.11.3.min.js"></script>
<script src="./theme/plug/layer-v3.0.3/layer/layer.js"></script>
<!-- <script type="text/javascript" src="./theme/js/jquery.backstretch.min.js"></script> -->

</head>
<body>
<div id="login_bg" class="login_box">
<div class="top_logo"><img src="./theme/images/login/yh_2.png" /></div>
<div class="login_aside">
  <form action="index-login" method="post" class="loginform" onsubmit="return false">
    <div class="fm_item">
      <label for="logonId" class="form_label"><img src="./theme/images/login/yonghu.png" /></label>
      <input type="text" value="" maxlength="100" name="username" id="username" class="i_text" placeholder="请输入用户名" />
    </div>
    <div class="fm_item">
      <label for="logonId" class="form_label"><img src="./theme/images/login/mima.png" /></label>
      <input type="password" value="" maxlength="100" name="password" id="password" class="i_text" placeholder="请输入密码">
    </div>
    <div class="fm_item_1">
      <div class="fm_item_yzm">
      <label for="logonId" class="form_label"><img src="./theme/images/login/yanzhengma.png" /></label>
      <input type="text" value="" maxlength="100" id="validate" name="validate" class="yzm i_text" placeholder="请输入验证码">
      </div>
      <div class="yzm_img"><!-- <img src="./theme/images/login/yzm2.png"/> --><img src="index-validation" id='refresh' align='absbottom' onclick ="this.src='index-validation?'+Math.random();" style="display:block; margin-top:5px; float:right;" /></div>
    </div>
    <div style="margin-top:18px;">
      <!-- <input type="submit" value="" tabindex="4" class="btn_login">
      <input type="reset"  class="btn_bg btn_reset" value="重&nbsp;&nbsp;&nbsp;置" /> -->
          <button class="btn_bg btn_login" style="margin-right:19%;">登&nbsp;&nbsp;&nbsp;录</button>
    </div>
  </form>
</div>
</div>
<div class="login_bottom">

</div>

<script type="text/javascript">
    //登录jquery
    $('.btn_login').click(function(){
      var form = $(this).parents('form');
      var data = form.serialize();
      var link=form.attr('action');
      var username = $('#username').val();
      var password = $('#password').val();

      if(!username){
        layer.tips('请输入用户名', '#username');
        return false;
      }
      if(!password){
        layer.tips('密码不可为空', '#password');
        return false;
      }

      var index = layer.load(); //显示加载层
      if(link!='undefined'){
        $.ajax({
          type:'post',
          url:link,
          data: data,
          dataType:'json',
          success:function(data){
            layer.closeAll('loading'); //关闭加载层
            //登录成功跳转
            if(data.status == 1){
              layer.msg(data.msg, {time: 2000, icon:1});
              location.href = data.href;
            }else{
              layer.msg(data.msg, {time: 2000, icon:2});
              $('#username').focus();
              $('#refresh').click();//重置验证码
            }

          }
        });
      }
      return false;

    });
</script>

</body>
</html>
